{extend name="layout"}
{block name="title"}增值账单{/block}
{block name="body"}
<div class="index-content" id="listwrap" style="height:100%; overflow:auto;">

	<!--    <div class="search-box">-->
	<!--        <input type="hidden" name="status" id="status" value="{$Think.get.status}" />-->
	<!--        <span class="iconfont icon-fangdajing"></span>-->
	<!--        <input type="search" name="search" value="{$Think.get.search}" class="search-head"  placeholder="搜索账单信息" >-->
	<!--    </div>-->
	<!--<div class="tips-info">
		<img src="__ROOT__/static/mobile/images/tips.png" alt="">
		<p>部分机型可能无法正常下载，请点右上角“•••”选择“在浏览器打开”，推荐使用UC浏览器</p>
	</div>-->
	<div class="index-tab">
		<a data-status="0" href="{:url('personal/increment/index')}" {if empty($Think.get.status) ||  $Think.get.status eq 0} class="on" {/if}>全部</a>
		<a data-status="1" href="{:url('personal/increment/index')}?status=1" {if $Think.get.status eq 1} class="on" {/if}>待付款</a>
		<a data-status="2" href="{:url('personal/increment/index')}?status=2" {if $Think.get.status eq 2} class="on" {/if}>待核对</a>
		<a data-status="3" href="{:url('personal/increment/index')}?status=3" {if $Think.get.status eq 3} class="on" {/if}>已付款</a>
	</div>

	<div class="index-table" style="padding-bottom: 2rem">
		{notempty name='list'}
		{foreach $list as $key=>$vo}
		<div class="table-item">
			<div class="item-title">
				<span>{$vo.code|default=''}</span>
				{if $vo.status eq 2}
				<span class="color-red">待付款</span>
				{elseif $vo.status eq 3}
				<span class="color-blue">待核对</span>
				{elseif $vo.status eq 4}
				<span class="color-desc">已付款</span>
				{/if}
			</div>
			<div class="item-box">
				<p>账单金额：{$vo.receivable|default=''}</p>
				<p class="p-wrap">
					<span>备注信息：</span>
                    <span>{$vo.desc|default=''}
                    </span>
				</p>

				<p>创建时间：{$vo.create_at|date='Y-m-d'}</p>

			</div>
			<div class="item-button">
				{if ($vo.status eq 2) or ($vo.status eq 3)}
				<a href="{:url('personal/increment/payment')}?id={$vo.id}"  class="is-blue">付款</i></a>
				{/if}

			</div>
		</div>

		{/foreach}

		<div class="weui-loadmore" style="display: none">
			<span class="weui-loading iconfont icon-jiazai1"></span>
			<span class="weui-loadmore__tips">正在加载</span>
		</div>
		{/notempty}
		{empty name='list'}
		<div class="table-blank">
			<img src="__ROOT__/static/mobile/images/blank1.png">
			<p>暂无数据</p>
		</div>
		{/empty}
	</div>


</div>
<div class="home-tab">
	<a href="{:url('personal/index/index')}">
		<span class="iconfont1 icon-shouye2 "></span>
		<span>首页</span>
	</a>

	<a href="{:url('personal/user/index')}">
		<span class="iconfont icon-shenfenzheng on"></span>
		<span>我的</span>
	</a>
</div>



{/block}
{block name="script"}
<script>
	$(function (){
		var docmHeight= document.documentElement.clientHeight ||document.body.clientHeight,
			showHeight= document.documentElement.clientHeight ||document.body.clientHeight
		// var Height = $('body').height();
		// console.log(docmHeight -80,showHeight)
		// 回到顶部
		$(window).resize(function () {
			// 回到顶部
			showHeight= document.documentElement.clientHeight ||document.body.clientHeight
			// console.log(showHeight)
			if((docmHeight - 100)> showHeight){
				//隐藏
				$(".home-tab").hide()
			}else{
				//显示
				$(".home-tab").show()
			}
		});
	})
</script>
<script>
	require(['weui'], function () {

		var pages = 1;
		loading = false;  //状态标记
		if($(".index-table").find('.table-item').length<10){
			loading = true
		}
		$("#listwrap").infinite().on("infinite", function () {
			if (loading) return;
			loading = true;
			pages+=1; //页数
			$('.weui-loadmore').show();
			setTimeout(function () {
				loadlist(pages);
			}, 1000);

		});

	})
	function loadlist(pages) {
		var html = "";
		console.log(pages)
		$.ajax({
			type: "POST",
			url: '{:url("page_list")}',
			data: { 'page': pages,"search" :$(".search-head").val(),status:$(".index-tab .on").attr("data-status")},
			dataType: "json",
			error: function (request) {
				$(".weui-loadmore").hide();
				html += '<div class="weui-cells__title" >已无更多数据</div>';
				$("#listwrap").find('.index-table .table-item:last').after(html);
				loading=true
			},
			success: function (data) {
				if (data.data.length > 0) {

					for (var i = 0; i < data.data.length; i++) {
						var vo = data.data[i]
						var h_span = ""
						var h_a =''
						if (vo.status ==2){
							h_span ='   <span class="color-red">待付款</span>'
							h_a += `<a  class="is-blue" href="{:url('personal/increment/payment')}?id=${vo.id}">付款</i></a>`
						}else if(vo.status==3){
							h_span = '<span class="color-blue">待核对</span>'
							h_a += `<a  class="is-blue" href="{:url('personal/increment/payment')}?id=${vo.id}">付款</i></a>`
						}else if(vo.status == 4){
							h_span = ' <span class="color-desc">已付款</span>'
						}


						html += `<div class="table-item">
                                    <div class="item-title">
                                        <span>${vo.code}</span>
                                          ${h_span}
                                    </div>
                                    <div class="item-box">
                                        <p>账单金额：${vo.receivable}</p>
                                       <p class="p-wrap">
                                            <span>备注信息：</span>
                                            ${vo.desc}
                                         </p>
                                        <p>创建时间：${vo.create_at.substring(0,10)}</p>

                                    </div>
                                    <div class="item-button">
                                       ${h_a}
                                    </div>
                                </div>`
					}
					$("#listwrap").find('.index-table .table-item:last').after(html);
					loading = false;
					if(data.data.length < 10){
						loading = true;
					}
				}
				else {
					html += "<div class=\"weui-cells__title\" >已无更多数据</div>";
					$("#listwrap").find('.index-table .table-item:last').after(html);
					loading = true;

				}
				$(".weui-loadmore").hide();
			}
		});
	}
	// function GetOpenid(id){
	//
	// 	var is_wx = 2 //不在微信
	// 	if(isWx()){
	// 		is_wx = 1
	// 	}
	// 	$.ajax({
	// 		type: "POST",
	// 		url: '{:url("GetOpenid")}',
	// 		data:{
	// 			id:id,
	// 			platform:is_wx
	// 		},
	// 		dataType: "json",
	//
	// 		success: function (res) {
	// 			if(res.code==1){
	// 				console.log(res)
	// 				if(is_wx==1){
	// 					window.location.href = res.data.url
	//
	// 				}else{
	// 					window.location.href = "{:url('mobile/insbill/payment')}?id=" +id
	//
	// 				}
	// 			}else{
	//
	// 			}
	// 		}
	// 	})
	//
	// }
</script>
{/block}

